<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>运动数据</title>
</head>

<body>
    <div class="sumdata pd16">
        <div class="back">
            <i class="iconfont icon-back fz24 colorfff"></i>
        </div>
        <div class="fz20 colorfff title">我的运动数据</div>
        <div class="sumSportData dpflex">
            <div class="dataleft flex1 pl16">
                <p class="colorfff">总运动</p>
                <div class="sumtime colorfff"><span id="sumtime" class="fz30">--</span>分钟</div>
            </div>
            <div class="dataright flex1 pl16">
                <p class="colorfff">本周消耗</p>
                <div class="weekcalorie colorfff"><span id="weekcalorie" class="fz30">--</span>千卡</div>
            </div>
        </div>
        <div class="dpflex jasbetween pt30">
            <div class="sumcalorie fz16 colorfff">
                <p>消耗</p>
                <p id="sumcalorie">--</p>
            </div>
            <div class="sumdays fz16 colorfff">
                <p>累计（天）</p>
                <p id="sumdays">--</p>
            </div>
            <div class="sumcontinuity fz16 colorfff">
                <p>连续（天）</p>
                <p id="sumcontinuity">--</p>
            </div>
        </div>
    </div>
    <!-- 柱状图 -->
    <div class="mt20" id="weekTimeChart"></div>

    <!-- 饼状图 -->
    <div class="mt20" id="sportCateChart"></div>

    <!-- 堆叠条形图 -->
    <div class="mt20" id="weekSportChart"></div>

    <!-- 折线图 -->
    <div class="mt20" id="trainChart"></div>

    <script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.3.0/echarts.min.js"></script>
</body>

</html>